<template>
  <rx-layout>
    <div slot="center" style>
      <rx-fit>
        <div slot="toolheader" foldheader="true" foldbtn="false" border="false">
          <div class="table-operator">
            <a-dropdown v-if="removeEnable && selectedRowKeys.length > 0">
              <a-button type="danger" icon="delete" @click="delByIds(selectedRowKeys)">{{$ti18('rxList.delBtn','删除')}}</a-button>
            </a-dropdown>
          </div>
          <span class="search-btn-box" v-if="!isheader">
              <span class="search-btn" @click.stop="searchshow">
                <i class="iconfont iconguolv"></i>{{$ti18('rxList.leachBtn','过滤')}}
              </span>
          </span>
        </div>
        <div slot="searchbar" searchdir="right" btnalign="right"  v-if="fitSearch" @search="search" @cancel="resetSearch" @close="close">
          <a-form :layout="colLayout">
            <a-row :gutter="24">
              <a-col :span="colSpan">
                <a-form-item :label="i18n('form.appName','应用')">
                  <a-select :placeholder="i18n('form.appName','应用','select')" allowClear v-model="queryParam.Q_APP_ID__S_LK" :options="appOptions" />
                </a-form-item>
              </a-col>
              <a-col :span="colSpan">
                <a-form-item :label="i18n('form.method','方法类型')">
                  <a-select :placeholder="i18n('form.method','方法类型','select')" allowClear v-model="queryParam.Q_METHOD__S_LK">
                    <a-select-option value="GET">GET</a-select-option>
                    <a-select-option value="POST">POST</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="colSpan" v-if="isheader">
                         <span class="table-page-search-submitButtons">
                              <a-button type="primary"  icon="search"  @click="$refs.table.loadData()">{{$ti18('rxList.searchBtn','查询')}}</a-button>
                              <a-button style="margin-left: 4px" @click="resetSearch" >{{$ti18('rxList.resetBtn','重置')}}</a-button>
                              <a @click="toggleAdvanced" style="margin-left: 8px">
                                            {{ advanced ? $ti18('rxList.putAwayBtn','收起') : $ti18('rxList.openBtn','展开') }}
                                            <a-icon :type="advanced ? 'up' : 'down'" />
                              </a>
                          </span>
              </a-col>

            </a-row>
          </a-form>
        </div>


        <rx-grid
                ref="table"
                :allowRowSelect="true"
                :multiSelect="true"
                :columns="columns"
                :bordered="isBorder"
                :defaultPageSize="10"
                url="/api-system/system/core/sysAppLog/query"
                :queryParam="queryParam"
                data-field="result.data"
                :pageSizeOptions="['10','30','40']"
                id-field="id"
                @selectChange="onSelectChange"
        >
          <span slot="duration" slot-scope="{text,record}">
            {{text/1000+i18n('form.second','秒')}}
          </span>
          <span slot="action" slot-scope="{ text, record }" class="actionIcons">
            <span v-if="removeEnable"  @click="delByIds([record.id])">{{$ti18('rxList.delBtn','删除')}}</span>
            <span @click="onRowClick(record)">{{$ti18('rxList.detailBtn','明细')}}</span>
          </span>
        </rx-grid>
      </rx-fit>
    </div>
  </rx-layout>
</template>

<script>
  import SysAppLogApi from '@/api/system/core/sysAppLog'
  import SysAuthManagerApi from "@/api/system/core/sysAuthManager"
  import SysAppLogEdit from './SysAppLogEdit'
  import SysAppLogGet from "./SysAppLogGet";
  import {BaseList} from "@lowcode/jpaas-common-lib";
  export default {
    name: 'SysAppLogList',
    mixins: [BaseList],
    data() {
      return {
        columns: [
          {
            title: this.$ti18('rxList.index','序号'),
            type: 'indexColumn',
            width: 60,
            dataIndex: 'serial',
            scopedSlots: {customRender: 'serial'}
          },
          {title: this.i18n('form.appName','应用名称'), dataIndex: 'appName', width: 100},
          {title: this.i18n('form.method','方法类型'), dataIndex: 'method', width: 100},
          {title: this.i18n('form.url','接口路径'), dataIndex: 'url', width: 100},
          {title: this.i18n('form.duration','持续时间'), dataIndex: 'duration', width: 100,scopedSlots: {customRender: 'duration'}},
            {title: this.$ti18('rxForm.createTime','创建时间'), dataIndex: 'createTime', sorter: true, sortField: 'CREATE_TIME_', width: 150},
          {title: this.$ti18('rxList.action','操作'), width: 160, dataIndex: 'action', scopedSlots: {customRender: 'action'}}
        ],
        component:SysAppLogEdit,
        comment:this.i18n('list.comment','应用授权接口日志表'),
        widthHeight:['800px','600px'],
        appOptions:[]
      }
    },
    created() {
      this.onload_();
    },
    methods:{
      i18n(name,text,key){
          return this.$ti18(name,text,"SysAppLog",key);
      },
      search(){
        this.$refs.table.loadData();
      },
      close(){
        this.fitSearch = false;
      },
      onload_(){
        SysAuthManagerApi.getAllList().then(res=>{
          this.appOptions=res.data.map(item=>{
            return {label:item.name,value:item.id};
          });
        })
      },
      delById(ids){
        return SysAppLogApi.del({ ids: ids.join(',') });
      },
      getListByParams(parameter) {
        return SysAppLogApi.query(parameter)
      },
      onRowClick(record) {
        var conf = {
          pkId: record.pkId,
          component: SysAppLogGet,
          title: this.i18n('list.detail','明细') + this.comment,
          widthHeight: this.widthHeight
        };
        this.handleEdit(conf);
      }
    }
  }
</script>
<style scoped>

</style>

